// The module 'vscode' contains the VS Code extensibility API
// Import the module and reference it with the alias vscode in your code below
const vscode = require('vscode');

// This method is called when your extension is activated
// Your extension is activated the very first time the command is executed

/**
 * @param {vscode.ExtensionContext} context
 */
function activate(context) {

    // Use the console to output diagnostic information (console.log) and errors (console.error)
    // This line of code will only be executed once when your extension is activated
    console.log('"pluginweb0" is now active');

    // The command has been defined in the package.json file
    // Now provide the implementation of the command with  registerCommand
    // The commandId parameter must match the command field in package.json
    const webview = vscode.commands.registerCommand('pluginweb0.helloWorld', function () {
        // The code you place here will be executed every time your command is executed

        // Display a message box to the user
        // vscode.window.showInformationMessage('Hello World from pluginWeb0!');
        vscode.window.showInformationMessage('show web panel')

        // 生成web页面
        const panel = genWeb()
    });

    context.subscriptions.push(webview);
}

// This method is called when your extension is deactivated
function deactivate() {
}

// 创建基于vue3的web
function genWeb() {
	const panel=vscode.window.createWebviewPanel(
		'view type', // viewType,标识符,需要唯一
		'this is title', // 视图标题
		vscode.ViewColumn.One, // 显示在编辑器的哪个部位
		{
			enableScripts: true, // 启用JS，默认禁用
			retainContextWhenHidden: true,// 长期保持页面存在,当页面隐藏时不释放
		}
	);
	panel.webview.html = `
	<!DOCTYPE html>
	<html lang="en">
	<head>
		<meta charset="UTF-8"/>
		<link rel="icon" href="/favicon.ico"/>
		<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
		<title>Vite App</title>
		<script> const vscode = acquireVsCodeApi(); </script>
	</head>
	<body>
	<div id="app">hello web</div>
	</body>
	</html>
	`;
	return panel;
}

module.exports = {
    activate,
    deactivate
}
